<template>
    <div class="my-activities">
        <div class="head-box">
            <div class="head-title">管理中心 / 我的活动</div>
        </div>
        <div class="tab-box">
            <el-tabs v-model="activeName" @tab-click="handleClick">
                <el-tab-pane label="全部" name="0">
                    <activitiesList
                        ref="activitiesList0"
                        :data_list="data_list0"
                        @loadFun="loadFun"
                        @upDataFun="upDataFun"
						@writeOffData="writeOffData"
                    ></activitiesList>
                </el-tab-pane>
                <el-tab-pane label="未发布" name="1">
                    <activitiesList
                        ref="activitiesList1"
                        :data_list="data_list1"
                        @loadFun="loadFun"
                        @upDataFun="upDataFun"
						@writeOffData="writeOffData"
                    ></activitiesList>
                </el-tab-pane>
                <el-tab-pane label="未开始" name="2">
                    <activitiesList
                        ref="activitiesList2"
                        :data_list="data_list2"
                        @loadFun="loadFun"
                        @upDataFun="upDataFun"
						@writeOffData="writeOffData"
                    ></activitiesList>
                </el-tab-pane>
                <el-tab-pane label="进行中" name="3">
                    <activitiesList
                        ref="activitiesList3"
                        :data_list="data_list3"
                        @loadFun="loadFun"
                        @upDataFun="upDataFun"
						@writeOffData="writeOffData"
                    ></activitiesList>
                </el-tab-pane>
                <el-tab-pane label="已结束" name="4">
                    <activitiesList
                        ref="activitiesList4"
                        :data_list="data_list4"
                        @loadFun="loadFun"
                        @upDataFun="upDataFun"
						@writeOffData="writeOffData"
                    ></activitiesList>
                </el-tab-pane>
            </el-tabs>
        </div>
		<el-dialog
		  title="配置核销员"
		  :visible.sync="isWriteOffShow"
		  width="30%"
		  >
		  <div class="isWriteOffBox">
				<el-tag  class="isWriteOffTag" 
				@click="writeOffParamClick(item)" 
				v-for="(item,index) in getcpList" :key="index" 
				size="medium" :type="writeOffParam.uid_ck==item.uid?'':'info'" 
				:effect="writeOffParam.uid_ck==item.uid?'dark':'light'">{{item.name}}</el-tag>
		  </div>
		  <span slot="footer" class="dialog-footer">
		    <el-button @click="isWriteOffShow = false">取 消</el-button>
		    <el-button type="primary" @click="sexHxFun">确 定</el-button>
		  </span>
		</el-dialog>
    </div>
</template>
<script>
import activitiesList from "@/components/interactive/activitiesList.vue";
import config from "@/js/conf/Config.js";

export default {
    props: [],
    components: { activitiesList },
    computed: {},
    data() {
        return {
            activeName: "0",
            data_list0: [], //全部
            data_list1: [], //未发布
            data_list2: [], //未开始
            data_list3: [], //进行中
            data_list4: [], //已结束
            form0: {
                pfrom: 0,
                pnum: 20,
                st: "",
            },
            form1: {
                pfrom: 0,
                pnum: 20,
                st: "1",
            },
            form2: {
                pfrom: 0,
                pnum: 20,
                st: "2",
            },
            form3: {
                pfrom: 0,
                pnum: 20,
                st: "3",
            },
            form4: {
                pfrom: 0,
                pnum: 20,
                st: "4",
            },
            is_soll0: true,
            is_soll1: true,
            is_soll2: true,
            is_soll3: true,
            is_soll4: true,
			
			isWriteOffShow: false 		,
			getcpList: [], // 核销人员列表
			isWriteOffI: 0,
			writeOffParam: {
				uid_ck: 0,
			},
            oldUid: '', //
        };
    },
    created() {
        this.handleClick();
		this.getcpListFun();
	},
    mounted() {},
    methods: {
        writeOffParamClick (row) {
            console.log('zxxzz')
            if (this.writeOffParam.uid_ck == row.uid) {
                this.writeOffParam.uid_ck = '';
            } else {
                this.writeOffParam.uid_ck = row.uid;
            }
            
        },
        handleClick() {
            let val = this.activeName;
            if (this[`data_list${val}`].length == 0) {
                this.gethdListFun();
            }
        },
		async getcpListFun() { // 获取核销配置人员列表
		    let url = config.UCP_LS;
		    let param = {
		        md: "xs",
		    };
		    let res = await this.$api({ url: url, data: param });
		    if (res.status == 1 && res.data) {
				this.getcpList = res.data
		    }
		},
		
		async sexHxFun() { // 设置核销配置人员
		    let url = config.HD_USER_SET_HX;
		    let res = await this.$api({ url: url, data: this.writeOffParam });
		    if (res.status == 1) {
				this.isWriteOffShow = false;
				this.$msg({ title: res.msg });
				this.upDataFun()
		    }
		},
		
        loadFun() {
            let val = this.activeName;
            if (this[`is_soll${val}`]) return;
            this[`form${val}`].pnum += 20;
        },
        async gethdListFun() {
            let val = this.activeName;
            this[`is_soll${val}`] = true;
            let url = config.HD_COMMON_HD_LS;
            let param = this[`form${val}`];
            let res = await this.$api({ url: url, data: param });
            if (!res) return;
            if (res.status == 1 && res.data.ls) {
                this[`data_list${val}`] = this[`data_list${val}`].concat(
                    res.data.ls
                );
                this[`data_list${val}`].map((v) => {
                    v.jp_num = "";
                    v.jp_num_data = [];
                });

                setTimeout(() => {
                    this[`is_soll${val}`] = false;
                }, 200);
            } else {
                this[`is_soll${val}`] = true;
            }
			
			
        },
        upDataFun () { // 更新数据
			let val = this.activeName;
			this[`data_list${val}`] = [];
            this.gethdListFun();
        },
		writeOffData (data) {
			this.isWriteOffShow = true;
			this.writeOffParam.hudongid = data.id;
			this.writeOffParam.uid_ck = data.uid_ck;
		},
    },
};
</script>

<style lang="scss" scoped >
.my-activities {
    background: #f2f2f2;
    height: 100%;

    .head-box {
        background: #fff;
        padding: 10px;
        .head-title {
            font-size: 18px;
        }
    }
	.isWriteOffBox {
		.isWriteOffTag {
			margin: 0 10px 10px 0;
            -moz-user-select:none;/*火狐*/
            -webkit-user-select:none;/*webkit浏览器*/
            -ms-user-select:none;/*IE10*/
            -khtml-user-select:none;/*早期浏览器*/
            user-select:none;
			cursor: pointer;
		}
	}
    ::v-deep.tab-box {
        height: calc(100% - 52px);
        .el-tabs__nav-scroll {
            padding: 0 10px;
            font-size: 14px;
        }
        .el-tabs__nav {
            .el-tabs__item {
                font-size: 16px;
            }
        }
    }
}
</style>
